<template>
             <el-row>
                    <el-col :span="span">
                        <el-form-item :label="label">
                            <el-checkbox
                                v-model="checkAll"
                                @change="all"
                                >全选</el-checkbox
                            >
                            <span class="spacing"></span>
                            <el-checkbox-group
                                v-model="target"
                                @change="checkchange"
                            >
                                <el-checkbox
                                    v-for="item in checkList"
                                    :key="item"
                                    :label="item"
                                    :value="item"
                                ></el-checkbox>
                            </el-checkbox-group>
                        </el-form-item>
                    </el-col>
            </el-row>
</template>

<script>
export default {
    data () {
        return {
            checkAll: false, //是否全选
            target: [], //返回的目标数组
        }
    },
    props: {
        //占用长度
        span: {
            type: [Number, String],
            default: 24
        },
        //字段名称
        label: {
            type: String,
            default: ''
        },
        //用于展示页面的数组
        checkList: {
            type: Array,
            default: ()=>[]
        },
        //传给后端的字段数组
        parmesList: {
            type: Array,
            default: ()=>[]
        }

    },
    computed: {

    },
    methods: {
        //全选事件
        all (val) {
            val
        },
        //选中事件
        checkchange (val) {
            val
        }
    },
}
</script>

<style lang="scss" scoped>

</style>